<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./static/css/css.css" />
</head>
<body>
    
    <div id="app2">
        <header id="header">
            <a href="/" id="logo"></a>
    
            <nav id="nav">
                <a href="">1</a>
                <a href="">笔记本</a>
                <a href="">家居</a>
            </nav>
    
            <div id="user">
                <a href="">登录</a>
                <a href="">注册</a>
            </div>
        </header>
    
        <div id="main">
    
            <div class="cart">
    
                <div class="panel flex-row">
                    
                    <div class="flex-column-checkbox tal">
                        <label>
                            <input type="checkbox" />
                            <span class="txt">全选</span>
                        </label>
                    </div>
                    <div class="flex-column-name tal">
                        商品
                    </div>
                    <div class="flex-column-price">
                        单价
                    </div>
                    <div class="flex-column-quantity">
                        数量
                    </div>
                    <div class="flex-column-total">
                        小计
                    </div>
                    <div class="flex-column-operation">
                        操作
                    </div>
    
                </div>
            
                <ul class="cart-items-list">
        
                    <li class="panel flex-row">
                        <div class="flex-column-checkbox tal">
                            <input type="checkbox">
                        </div>
                        <div class="flex-column-name tal">
                            <img src="../数据/images/c39fe0cb7ab36c13.jpg" alt="" class="cover">
                            <span class="name">HUAWEI P40 Pro</span>
                        </div>
                        <div class="flex-column-price">
                            <span class="price">¥5988</span>
                        </div>
                        <div class="flex-column-quantity">
                            <span class="quantity-add">-</span>
                            <span class="quantity-num" contenteditable>1</span>
                            <span class="quantity-sub">+</span>
                        </div>
                        <div class="flex-column-total">
                            <span class="total">¥5988</span>
                        </div>
                        <div class="flex-column-operation">
                            <span class="operation-delete">删除</span>
                        </div>
                    </li>
    
                    <li class="panel flex-row">
                        <div class="flex-column-checkbox tal">
                            <input type="checkbox">
                        </div>
                        <div class="flex-column-name tal">
                            <img src="../数据/images/c39fe0cb7ab36c13.jpg" alt="" class="cover">
                            <span class="name">HUAWEI P40 Pro</span>
                        </div>
                        <div class="flex-column-price">
                            <span class="price">¥5988</span>
                        </div>
                        <div class="flex-column-quantity">
                            <span class="quantity-add">-</span>
                            <span class="quantity-num" contenteditable>1</span>
                            <span class="quantity-sub">+</span>
                        </div>
                        <div class="flex-column-total">
                            <span class="total">¥5988</span>
                        </div>
                        <div class="flex-column-operation">
                            <span class="operation-delete">删除</span>
                        </div>
                    </li>
        
                </ul>
    
                <div class="cart-footer panel flex-row">
    
                    <div>
                        <input type="checkbox" />
                        <span>全选</span>
                        <span>删除</span>
                    </div>
                    <div>
                        <span>一共选择了 <strong class="quantity">9</strong> 件商品，总计 <strong class="total">¥ 40439.00</strong> 元</span>
                        <span class="pay-btn disabled">立即支付</span>
                    </div>
    
                </div>
    
        
                <div class="pagination-container">
                    
                    <div class="pagination">
                        <a href="" class="prev">上一页</a>
                        <a href="">1</a>
                        <a href="">2</a>
                        <a href="">3</a>
                        <a href="" class="current">4</a>
                        <a href="">5</a>
                        <a href="">6</a>
                        <a href="">7</a>
                        <a href="">8</a>
                        <a href="" class="next">下一页</a>
                    </div>
        
                </div>
    
                
    
            </div>
    
        </div>
    </div>

</body>
</html>